<template>
    <a-space direction="vertical" :style="{ width: '100%' }" :size="[0, 48]">
        <a-layout>
            <a-layout-header :style="headerStyle"></a-layout-header>
            <a-layout>

                <a-layout-content :style="contentStyle">
                    <LoginForm></LoginForm>
                </a-layout-content>

            </a-layout>
            <a-layout-footer :style="footerStyle"></a-layout-footer>
        </a-layout>
    </a-space>
</template>
<script setup>

import LoginForm from './LoginForm.vue';

const headerStyle = {
    textAlign: 'center',
    color: '#fff',
    height: 64,
    paddingInline: 50,
    lineHeight: '64px',
};
const contentStyle = {
    textAlign: 'center',
    width: '400px',
    margin: '0 auto',
    color: '#fff',

};
const siderStyle = {
    textAlign: 'center',
    lineHeight: '120px',
    color: '#fff',

};
const footerStyle = {
    textAlign: 'center',
    color: '#fff',
};

</script>

<style scoped>
.login-content-form {
    border: 1px solid #e3e3e3;
    padding: 60px;
    border-radius: 8px;
    overflow: hidden;
    box-sizing: border-box;
}
</style>